var ZoomForm = function () {
  var template = /* html */ `
    <div>
      <el-input-number style="width:100%" v-model="zoom" size="small" :min="0.1" :max="4" :step="0.1" :precision="1"
        @change="ensure">
      </el-input-number>
    </div>
  `;

  return {
    props: {
      value: {
        type: Number,
        required: true
      }
    },

    watch: {
      value: function () {
        if (this.inputValue !== null) {
          this.inputValue = null;
          return;
        }

        this.zoom = this.value;
      }
    },

    data: function () {
      return {
        zoom: this.value,
        inputValue: null
      };
    },

    methods: {
      ensure: function () {
        var zoom = this.zoom;
        window.localStorage.setItem('dayAttendanceBoard-zoom', zoom);
        this.inputValue = zoom;
        this.$emit('input', zoom);
        this.$emit('change', zoom);
      }
    },

    template: template
  };
}();
